<template>
	<uni-goods-nav :fill="true"  
	:options="options" 
	:buttonGroup="buttonGroup"  
	@click="onClick" 
	@buttonClick="buttonClick" />
</template>

<script>

import { mapState,mapMutations,mapGetters } from 'vuex'
export default {
	
	data() {
		return{
			options: [{
			            icon: 'headphones',
			            text: '客服'
			        }, {
			            icon: 'shop',
			            text: '店铺',
			            info: 0,
			            infoBackgroundColor:'#ff0000',
			            // infoColor:"red"
			        }, {
			            icon: 'cart',
			            text: '购物车',
			            info: 0
			        }],
			        buttonGroup: [{
			          text: '加入购物车',
			          backgroundColor: '#ff0000',
			          color: '#fff'
			        },
			        {
			          text: '立即购买',
			          backgroundColor: '#ffa200',
			          color: '#fff'
			        }
			 ],
			 num: 0
		}
		
	},
	props:{
		goods_info:{
			type:Object,
			default:{}
		}
	},
	onLoad() {
		this.goods_info
	},
	computed:{
		...mapState('m_cart', ['cart']),

		...mapGetters('m_cart', ['total'])

	},
	watch:{
		total: {
		      // handler 属性用来定义侦听器的 function 处理函数
		      handler(newVal) {
		         const findResult = this.options.find(x => x.text === '购物车')
		         if (findResult) {
		            findResult.info = newVal
					// console.log(findResult);
		         }
				 
		      },
			immediate: true
		}
		// total(newVal){
		// 	const findResult =  this.options.find(x => x.text === "加入购物车")
		// 	if(findResult) {
		// 		findResult.info = newVal 
		// 	}
		// 	console.log(findResult.info);
		// }
	},
	methods: {
		
		...mapMutations('m_cart',['addToCart']),	  
	      onClick (e) {
	        uni.showToast({
	          title: `点击${e.content.text}`,
	          icon: 'none'
	        })
			if(e.content.text == '购物车'){
				uni.switchTab({
					url:'../../pages/cart/cart'
				})
			}
			// console.log(e);
	      },
	      buttonClick (e) {
			if(e.content.text == '加入购物车'){

				const goods = {
					goods_id: this.goods_info.goods_id,
					goods_name: this.goods_info.goods_name,
					goods_price: this.goods_info.goods_price,
					goods_count: 1,
					goods_small_logo: this.goods_info.goods_small_logo,
					goods_state: true,   // 商品的勾选状态
					goods_exist: 1,
				}
				this.addToCart(goods)
				// const a = this.addToCart()
				// console.log(this.cart)
				
				console.log(this.num);
				this.$u.toast('添加购物车成功')
				this.options[2].info++
			}
	      }
	    }
};
</script>

<style lang="scss" scoped>

</style>
